<template>
  <div>
    <l-header :sliderShow="false"></l-header>
    <div class="w89">
      <h2 class="title">{{$t('verification.index.5636t6sgg7k0')}}</h2>
      <h3 class="title_msg">
        {{$t('verification.index.5636t6sghi40')}}
      </h3>
      <ul class="stepList">
        <li v-for="(item, index) in stepList" :key="index">
          <img :src="item.icon" alt="" />
          <h2>{{ index + 1 }}.{{ item.title }}</h2>
          <h3 class="title_msg">
            {{ item.subtitle }}
          </h3>
        </li>
      </ul>
      <ul class="imgList" >
        <li v-if="local && (legalizeType=='' || legalizeType=='2')" @click="identidy('2','OnlineAddress')">
          
            <div>
              <!-- 汇款通知 -->
                <h1>{{$t('verification.index.5636t6sghtc0')}}</h1>
                <h3>{{$t('verification.index.5636tm7cg6s0')}}{{user_type=='2'?$t('verification.index.5636tvbfph80'):$t('verification.index.5636tvbfqrk0')}}{{$t('verification.index.5636tm7ch8s0')}} </h3>
            </div>
            <img src="~@/assets/img/you.png" alt="" />
          
        </li>
        <li  v-if="web && (legalizeType=='' || legalizeType=='3')" @click="identidy('3','CounterAddress')">
            <div>
                <h1>{{$t('verification.index.5636t6sgi1s0')}}</h1>
                <h3>{{$t('verification.index.5636t6sgia40')}}</h3>
            </div>
            <img src="~@/assets/img/you.png" alt="" />
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
import { fff } from "@/assets/less/global.less";
import {identity} from '@/api/allPage'
export default {
  inject: ['branch','StepsPage','user_fill'],
  data() {
    return {
      user_type:localStorage.getItem('userType'),
      stepList: [
        {
          icon: require("@/assets/img/icon1.png"),
          title: this.$t('verification.index.5636t6sgijo0'),
          subtitle: this.$t('verification.index.5636t6sgis00'),
        },
        {
          icon: require("@/assets/img/icon2.png"),
          title: this.$t('verification.index.5636t6sgj280'),
          subtitle: "",
        },
      ],
    };
  },
  computed:{
    StepsPageList(){
        return this.StepsPage()
    },
    branchList(){
      return this.branch()
    },
    legalizeType(){
        return (this.user_fill()?.legalizeType ?? '')
    },
    local(){//网上
      return  (JSON.stringify(this.branchList?.local||[])=='[]'?false:true)
    },
    web(){//柜台
      return  (JSON.stringify(this.branchList?.web||[])=='[]'?false:true)
    }
  },
  created() {
    //type=1  已开过户 查看详情
    console.log(this.$route.query.type);
  },
  methods: {
    identidy(legalizeType ,url) {
      identity({legalizeType})
      .then(res=>{
          if(res.code==1){
            if(res.data.isExists==true){
                
                this.$nextPage({pageId:this.StepsPageList.next_id})
                .then(next=>{
                    this.loading = false;
                })
            }else{
              this.$router.replace(url);
            }
          }
      })
    },
  },
};
</script>
<style lang="less" scoped>
.stepList {
  padding-top: 0.2rem;
  li {
    margin: 0.15rem 0;
    img {
      max-width: 0.3rem;
      vertical-align: text-bottom;
    }
    h2 {
      display: inline-block;
      font-size: 0.26rem;
      margin-left: 0.15rem;
    }
    h3 {
      font-size: 0.26rem;
      padding: 0.05rem 0 0.05rem 0.67rem;
    }
  }
}
.imgList {
  margin-top: 0.3rem;
  li {
      background: url("~@/assets/img/verBg.png") no-repeat center center;
      background-size: 102% 102%;
      color: #fff;
      padding: 0.15rem 0.35rem 0.4rem;
      margin: 0.05rem 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      h1 {
        font-size: 0.4rem;
        line-height: 0.7rem;
        font-weight: 300;
      }
      h3 {
        font-size: 0.22rem;
        font-weight: 300;
      }
      img {
        max-width: 0.2rem;
      }
  }
}
</style>
